<template>
    <!-- 系统设置---运维管理---体检预约解锁页面 -->
    <div class="fillcontain">
        <el-form :model="searchParams" label-width="100px" class="search_container">
            <el-row>
                <el-col :span="6">
                    <el-form-item label="预约单号" prop="errorDataInfo">
                        <el-input clearable v-model="searchParams.errorDataInfo" @blur="searchParams.errorDataInfo = searchParams.errorDataInfo.toUpperCase()" placeholder=""></el-input>
                    </el-form-item>
                </el-col>
                <el-col :span="6">
                    <el-form-item label="作业异常日志" prop="pntype">
                        <el-input clearable v-model="searchParams.errorInfo" @blur="searchParams.errorInfo = searchParams.errorInfo.toUpperCase()" placeholder=""></el-input>
                    </el-form-item>
                </el-col>
                <el-col :span="6" class="text_center">
                    <!-- 查询 --->
                    <el-button type="primary" icon="el-icon-search" @click="submitSearch"></el-button>
                    <!-- 重置 --->                    
                    <el-button type="primary" plain icon="el-icon-refresh" @click="resetSearch"></el-button>
                </el-col>
            </el-row>
        </el-form>
        <div class="contain">
            <!-- 查询结果 -->
            <div class="table_container">
                <el-table v-loading="loading" :data=" batchErrorListData" highlight-current-row header-cell-class-name="table-header-class"
                    style="width:100%">
                    <el-table-column min-width="80" property="errorJobId" label="作业step名称" align='center' show-overflow-tooltip :formatter="setBatchSteps">
                    </el-table-column>
                    <el-table-column min-width="80" property="errorDataInfo" label="预约单号" align='center' show-overflow-tooltip >
                    </el-table-column>
                    <el-table-column min-width="140" property="errorInfo" label="作业异常日志" align='center'  show-overflow-tooltip>
                    </el-table-column> 
                    <el-table-column min-width="50" property="errorStatus" label="处理状态" align='center'  show-overflow-tooltip :formatter="setErrorStatus">
                    </el-table-column> 
                    <el-table-column min-width="80" property="createTime" label="创建时间" align='center'  show-overflow-tooltip>
                    </el-table-column> 
                    <el-table-column min-width="50" fixed="right" label="操作" align='center'>
                        <template slot-scope="scope"> 
                            <span v-if="scope.row.errorStatus==1" class="operationIcon ml5" @click="unlockTask(scope.row)" >
                                <el-tooltip class="item" effect="light" content="解锁" placement="top">
                                    <i class="el-icon-goods"></i>
                                </el-tooltip>
                            </span>
                            <span v-else class="operationIcon ml5"  >
                                <el-tooltip class="item" effect="light" content="不能解锁" placement="top">
                                    <i class="el-icon-close"></i>
                                </el-tooltip>
                            </span>
                        </template>
                    </el-table-column>
                </el-table>
                <el-row>
                    <el-col :span="24">
                        <div class="pagination">
                            <el-pagination background v-if='paginations.total > 0' :page-sizes="paginations.pageSizes" :page-size="paginations.pageSize"
                                :layout="paginations.layout" :total="paginations.total" :current-page='paginations.pageIndex'
                                @current-change='handleCurrentChange' @size-change='handleSizeChange'>
                            </el-pagination>
                        </div>
                    </el-col>
                </el-row>
            </div>
        </div> 

    </div>
</template>

<script> 
    import { mapState, mapGetters } from 'vuex'
    import constant from '@/utils/constant';
    import appName from "@/api/appName"
    import { getToken, setToken } from '@/utils/auth'
    import axios from 'axios'; 
    import {  pageList, saveNote ,deleteNote } from "@/api/setting/maintain/peunlock.js";
 

export default {
    data() { 

        return {
            //常量：作业step名称 
            batch_steps: [
                { value: 'booking_health_code',     label: '获取健检号' },
                { value: 'booking_download_pdf',    label: '下载PDF体检报告' },
                { value: 'booking_pdf_change_tif',  label: 'PDF报告转TIF文件' },
                { value: 'booking_create_xml',      label: '创建XML文件' },
                { value: 'booking_create_zip',      label: '创建影像压缩包并发送至cdfs服务器' } 
            ],
            //常量：处理状态
            error_Status: [
                { value: '1', label: '待处理' },
                { value: '2', label: '已解锁' },
                { value: '3', label: '已完成' }  
            ],
            update_inds: [
                { value: 'I', label: 'I--新增' },
                { value: 'U', label: 'U--更新' },
                { value: 'D', label: 'D--删除' }
            ],
            noteDataDialog: false,//默认隐藏 照会代码维护新增或修改弹框
            // 表单验证规则
            rules: {  
            },
            // 查询条件
            searchParams: {
                errorDataInfo: '',// 业务主键（预约单号）
                errorInfo: '',// 操作日志
                jobType:"booking" // job类型：体检预约
            },
            // 主档列表数据
            batchErrorListData: [
            ],
            loading: false,
            editType: '', //编辑类型，add-新增 modify-修改
            option: '', 
            isCheck: true,
            saveButton: true,
            //需要给分页组件传的信息
            paginations: {
                total: 0,      // 总数
                pageIndex: 1,  // 当前位于哪页
                pageSize: 10,  // 1页显示多少条
                pageSizes: [5, 10, 15, 20],  //每页显示多少条
                layout: "total, sizes, prev, pager, next, jumper"   // 翻页属性
            } 
        }
    },
    created() {
        //  this.getList();
    },
    mounted() {
        //  this.getList(); 
    },
    methods: {  
        // 解锁
        unlockTask(row) {
            this.$confirm('确定是否解锁？', '提示', {
                confirmButtonText: '确定',
                cancelButtonText: '取消',
                type: 'warning'
            }).then(() => {
                let param = {
                    id: row.id,
                    errorStatus:"2"
                }
                saveNote(param).then(res => {
                    if (res.resultCode == constant.SUCCESS) {
                        this.$message({
                                type: 'success',
                                message: '解锁成功，等待定时作业处理!'
                        });                      
                        this.paginations.pageIndex = 1;
                        this.getList();
                    }
                }).catch(err => {
                })

            }).catch(() => {
                this.$message({
                    type: 'info',
                    message: '已取消解锁'
                });
            });
        }, 
        // 查询列表
        getList() {
            this.paginations.total = 0;
            this.batchErrorListData = [];
            let para = {
                "errorDataInfo": this.searchParams.errorDataInfo,
                "errorInfo": this.searchParams.errorInfo,
                "jobType":this.searchParams.jobType,
                "pageSize": this.paginations.pageSize,
                "pageNumber": this.paginations.pageIndex,
                "orderBy":"create_time DESC"
            }
            this.$store.dispatch('loading/CHANGE_LOADING', true)
            pageList(para).then(res => {
                this.$store.dispatch('loading/CHANGE_LOADING', false)
             
                if (res.resultCode == constant.SUCCESS && res.data) {
                    if (res.data.list.length) {
                        this.batchErrorListData = res.data.list;
                        this.paginations.total = res.data.total;
                    } else {
                        this.$message({
                            message: '无符合条件任务！',
                            type: 'error'
                        });
                    }
                }
            }).catch(err => {
                this.$store.dispatch('loading/CHANGE_LOADING', false);
            })
        },
        // 每页多少条切换
        handleSizeChange(pageSize) {
            this.paginations.pageSize = pageSize;
            this.getList();
        },
        // 上下分页
        handleCurrentChange(page) {
            this.paginations.pageIndex = page;
            this.getList();
        },
        // 根据条件查询列表
        submitSearch() {
            this.paginations.pageIndex = 1;
            this.getList();
        },
        // 清除查询条件
        resetSearch() {
            this.searchParams.errorDataInfo = '';
            this.searchParams.errorInfo = '';
        }, 
        //[作业step名称]字段转中文
        setBatchSteps(row) {
            debugger;
            let result = row.errorJobId;
            this.batch_steps.forEach(e => {
                if (e.value == row.errorJobId) {
                    result = e.label; 
                } 
            })
            return result;
        },
        //[处理状态]字段转中文
        setErrorStatus(row) {
            debugger;
            let result = row.errorStatus;
            this.error_Status.forEach(e => {
                if (e.value == row.errorStatus) {
                    result = e.label; 
                } 
            })
            return result;
        }  
    },
    computed: {
        ...mapGetters(['tags']),
        reload() {
            return this.$store.state.loading.reload;
        }
    },
    activated() {
        if (this.reload) {
            this.$store.dispatch('loading/CHNAGE_RELOAD', false)
            Object.assign(this.$data, this.$options.data());
        }
    }
}

</script>

<style lang="less" scoped>
    .fillcontain {
        padding-bottom: 0;
    }

    .contain {
        background: #fff;
        padding: 10px;
        margin-bottom: 20px;
    }

    .pagination {
        padding: 10px 20px;
        text-align: right;
    }

    .operationIcon {
        // padding: 12px;
        border: 1px solid #e5e5e5;
        border-radius: 50%;
        width: 22px;
        height: 22px;
        display: inline-block;
        cursor: pointer;
        box-shadow: 0 0 3px #f9f9f9;
    }

    .search_container {
        padding: 20px 20px 0 20px; //    border-top: 1px solid #e1e1e1;
    }

    .common-box {
        padding-bottom: 15px;
    }

    .common-lab {
        line-height: normal!important;
        text-align: right;
        .labelName {
            text-align: right;
        }
    }
</style>